<template>
    <div id="registered">
        <div class="row mt-3">
            <div class="col-md-12 col-lg-12">
                <div class="card">
                    <div class="card-body">
                        <img class="mx-auto d-block" src="../../src/assets/icon.png" />
                        <form @submit.prevent="onSubmit">
                            <div class="form-group">
                                <label for="username">用户名</label>
                                <input class="form-control" type="text" v-model="username">
                            </div>
                            <div class="form-group">
                                <label for="email">邮箱</label>
                                <input class="form-control" type="text" v-model="email">
                            </div>
                            <div class="form-group">
                                <label for="password">密码</label>
                                <input class="form-control" type="password" v-model="password">
                            </div>
                            <div class="form-group">
                                <label for="confirm_password">确认密码</label>
                                <input class="form-control" type="password" v-model="confirm_password">
                            </div>
                            <button class="btn btn-block btn-success" type="submit">注册</button>
                        </form>
                    </div>
                </div>
            </div>
        </div>
    </div>
</template>

<script>
    export default {
        name: "Registered",
        data() {
            return {
                username: "",
                email: "",
                password: "",
                confirm_password: ""
            }
        },
        methods: {
            onSubmit() {
                if(this.password === this.confirm_password){
                    const formData = {username: this.username, password: this.password, email: this.email}
                    Bmob.User.register(formData).then(response => this.$router.push({name: "Login"})).catch(error => console.log(error));
                }else {
                    
                }
            }
        }
    }
</script>

<style scoped>

</style>